<!-- myAside.vue -->
<template>
    <el-menu active-text-color="#ffd04b" background-color="#545c64" class="el-menu-vertical-demo" default-active="2"
        text-color="#fff" @open="handleOpen" @close="handleClose" :collapse="isCollapse" :style="{'width':isCollapse?'64px':'230px'}">
        <p class="logo-lg"> 
            {{ isCollapse ? 'HJJ' : 'HJJ陪诊'}}
        </p>
        <tree-menu :index="1" :menuData="menuData"/><!--将父组件的menuData传递到子组件中去-->
    </el-menu>
</template>

<script setup>
import treeMenu from './treeMenu.vue';
import {useRouter} from 'vue-router';
import {ref,reactive,computed} from 'vue';
import { useStore } from 'vuex';
const router =useRouter()
const menuData = reactive(router.options.routes[0].children)
console.log("mmm")
console.log(menuData)
const store = useStore()
const isCollapse= computed(()=>store.state.menu.isCollapsed)//这里的定式就是store.state.模块名.参数/方法


//现在将该徐建的信息传递到子组件中去
const handleOpen = (key, keyPath) => {

}
const handleClose = (key, keyPath) => {

}
</script>

<style lang="less" scoped>
.el-menu-vertical-demo{
    height: 100%;
    width: 230px;
    .logo-lg{
        font-size: 20px;
        text-align: center;
        height: 50px;
        line-height: 50px;
        color: white;

    }
}
</style>